<template>
    <div>
        <el-menu :default-active="path" background-color="#545c64" text-color="#fff" active-text-color="#ffd04b" router unique-opened>
            <el-menu-item index="/home">
                <i class="el-icon-menu"></i>
                <span>首页</span>
            </el-menu-item>
            <el-submenu v-for="item in $store.getters.getUserinfo.menus" :key="item.id" :index="item.id.toString()" active-text-color="#ffd04b">
                <template slot="title">
                    <i :class="item.icon"></i>
                    <span slot="title">{{item.title}}</span>
                </template>
                    <el-menu-item v-for="menu in item.children" :key="menu.id" :index="menu.url">{{menu.title}}</el-menu-item>
            </el-submenu>
        </el-menu>
    </div>
</template>

<script>
export default {
    data() {
        return {
            path:'/home'
        };
    },
    mounted(){
        this.path=this.$route.path
    }
};
</script>

<style  lang="less" scoped>
.el-menu {
    min-height: 600px;
}
</style>
